<pre class="docs-method-signature"><code>element.translate(tx, [ty], [opt])</code></pre>

<p>Translate an element by <code>tx</code> pixels in x axis and <code>ty</code> pixels in y axis.
            <code>ty</code> is optional in which case the translation in y axis will be considered zero.
            The optional options object <code>opt</code> can be used to pass additional parameters to the event handlers
            listening on <code>'change:position'</code> events. <code>opt.transition</code> can be used to initiate an animated
            transition rather than a sudden move of the element. See <a href="#dia.Element.prototype.transition">joint.dia.Element:transition</a> for more info
            on transitions. If <code>opt.restrictedArea</code> is set, the translation of the element will be restricted to that area only.
            The <code>restrictedArea</code> is an object of the form <code>{ x: Number, y: Number, width: Number, height: Number }</code>.
            This is useful, e.g. if you want to restrict the translation of an embedded element within its parent. The only thing
            you have to do in this case is to pass the bounding box of the parent element to the <code>restrictedArea</code> option:</p>
            <pre><code>myElement.translate(50, 50, { restrictedArea: graph.getCell(myElement.get('parent')).getBBox() })</code></pre>
            <p>The code above makes sure that the element <code>myElement</code> never crosses the bounding box of its parent element.
            note that this also works if the element <code>myElement</code> has other embedded elements. In other words, the
            bounding box of the <code>myElement</code> that is used to calculate the restriction is the total bounding box,
            including all its children (in case they are <q>sticking out</q>).</p>